<template>
  <div class="goodsBox">
    <el-tree
      v-loading="!goodClassList"
      ref="tree"
      :data="goodClassList"
      :default-expanded-keys="editorThreedata"
      :default-checked-keys="editorThreedata"
      :props="defaultProps"
      show-checkbox
      check-strictly
      node-key="catId"
      @check-change="handleClick"/>
  </div>
</template>

<script>
import * as commodity from '../../../api/commodity'
import { getUserInformation } from '@/utils/auth'
export default {
  /* eslint-disable vue/require-prop-types */
  props: ['type', 'editorData'],
  data() {
    return {
      editorThreedata: [],
      // 状态
      goodClassList: null,
      defaultProps: {
        children: 'children',
        label: 'catName',
        disabled: this.disabledFn
      }
    }
  },
  beforeMount() {
    this.getList()
    if (this.type === 2 || this.type === 3 || this.type === 4) {
      const catId = this.editorData.itemId
      this.getclassThree(catId)
    }
  },
  methods: {
    // 获取用户信息
    getUser() {
      return JSON.parse(getUserInformation())
    },
    getList() {
      const param = {
        current: 1,
        size: 5999
      }
      if (this.getUser().sellerId !== null) {
        param.isWebMallCat = 1
      } else {
        param.isWebMallCat = 0
      }
      commodity.getGoodCategoryList(param).then(res => {
        if (res.data.code !== 1) {
          this.$message.error(res.data.msg)
          return false
        }
        if (res.data.data === 'null' || res.data.data === null) {
          return false
        }
        // 初始化three树
        this.goodClassList = res.data.data.records
      })
    },
    getclassThree(data) {
      commodity.getcadList(data).then(res => {
        this.editorThreedata = res.data.data
      })
    },
    // 查看禁用
    disabledFn(data, node) {
      if (this.type === 3) {
        return true
      } else {
        return false
      }
    },
    handleClick(data, checked, node) {
      if (checked === true) {
        this.editorThreedata.push(data.catId)
      } else {
        for (const val of this.editorThreedata) {
          if (val === data.catId && checked === false) {
            const index = this.editorThreedata.indexOf(val)
            if (index > -1) {
              this.editorThreedata.splice(index, 1)
            }
          }
        }
      }
    },
    incrementTotal() {
      this.$emit('goodclassSuccess', this.editorThreedata)
    }

  }
}
</script>

<style type="text/scss" lang="scss">
  .goodsBox{
    .el-form-item{
      margin-bottom: 12px;
    }
    .el-form-item__label{
      line-height: 18px;
      margin-top: 9px;
    }
    .el-form-item__error{
      top: 90%;
    }
  }
</style>
<style type="text/scss" lang="scss" scoped>
</style>
